
<template>

    <base-node type="ai_chat" :config="props.data" :id="props.id" ref="baseNode">
        <template #default>
            <AiChatSetting v-model="props.data.llmConfig"
                           :out="['modelType', 'promptTpl','outputToResponse','steam','outputThinking', 'useContext', 'persistDb',]"
                           :inner="['systemRole','maxTokens', 'temperature', 'topP', 'topK', 'renderType']"/>
        </template>

        <template #footer>
            <p class="tc-gray ">输出字段</p>
            <div class="output mt-8 pad-8 fx fx-c_center fx-m_between">
                <div class="fx fx-c_center">
                    <div class="output-flag noshrink"></div>
                    <n-input v-model:value="props.data.llmConfig.outputField" placeholder="字段名"
                             class="tc-gray ml-8 w-140"></n-input>
                </div>
                <span class="tc-assist">AI 生成的回答</span>
            </div>
        </template>

        <template #source>
            <Handle type="source" id="success" :position="Position.Right"
                    style="transform: translate(50%, calc(-50% - 30px))"/>
            <Handle type="source" id="fail" :position="Position.Right"
                    style="transform: translate(50%, calc(-50% + 30px))"/>
        </template>
    </base-node>

</template>
<script setup>

import {
    Position,
    Handle,
    useVueFlow
} from '@vue-flow/core'
import {
    watch,
    provide, inject, ref, computed
} from "vue";

import AiChatSetting from './cnps/AiChatSetting.vue';
import BaseNode from "@/views/app/chain/nodes/BaseNode.vue";

const props = defineProps(['id', 'data'])
provide('currentNodeId', props.id);


const baseNode = ref(null);


provide("baseNode", baseNode)

</script>


<style scoped>

label {
    margin-bottom: 8px;
}

label:not(:first-child) {
    margin-top: 16px;
}

.output {
    background: rgb(249, 250, 251);
    border-radius: 12px;
}

.output-flag {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #22c55e;
}

</style>
